<template>
	<view class="index">
		<!-- <view @click="getBrandList">1111111111111111111111111</view> -->
		<view class="itemBox" :class="{active:brandIndex!==null}">
			<picker @change="bindPickerBrandChange" :value="brandIndex" range-key="name" :range="carBrand">
				{{brandIndex===null?'请选择吊车品牌':carBrand[brandIndex].name}}
			</picker>
		</view>
		<view class="itemBox" :class="{active:modelIndex!==null}">
			<picker @change="bindPickerModelChange" :value="modelIndex" range-key="name" :range="carModel">
				{{modelIndex===null?'请选择吊车型号':carModel[modelIndex].name}}
			</picker>
		</view>
		<view class="button" @click="search" @tap="oauth('weixin')">查询</view>
	</view>
</template>

<script>
	import {
		getBrandList,
		getCraneList,
		member,
		addCompbind
	} from '@/api/crane.js'
	export default {
		data() {
			return {
				us:"",
				userid:10000004,
				huiyuan:1,
				carBrand: [],
				carModel: [],
				brandIndex: null,
				modelIndex: null,
				brandList: [],
				isFlag:"select",
				getadd:"getAdd",
			}
		},
		 onLoad() {
		 
		},
		mounted:async function(){
			// uni.showLoading();
			await this.getBrandList();
			uni.hideLoading();
		},
		computed: {

		},
		methods: {
			 oauth(value) {
			                uni.login({
			                    provider: value,
			                    success: function(loginRes) {
			                        // console.log(loginRes.authResult);
			                        // 获取用户信息
			                        uni.getUserInfo({
			                            provider: value,
			                            success: function(infoRes) {
			                                // console.log('用户昵称为：' + infoRes.userInfo.nickName);
			                                console.log(infoRes);
			                            }
			                        });
			                    }
			                });
			            },
			bindPickerBrandChange: function(e) {
				this.brandIndex = e.target.value;
				
				this.getCarList(this.carBrand[this.brandIndex].id);
			},
			bindPickerModelChange: function(e) {
				this.modelIndex = e.target.value
			},
			search: function() {
				console.log(123,this.$store.state.app.uid)
				if (this.brandIndex === null || this.modelIndex === null) {
					uni.showToast({
						title: `请选择吊车${this.brandIndex === null ?'品牌':'型号'}`,
						icon: 'none',
						duration: 1500
					});
					return;
				}
				uni.login({
				  provider: 'weixin',
				  success: function (loginRes) {
				    console.log(loginRes.authResult);
				    // 获取用户信息
				    uni.getUserProfile({
				      provider: 'weixin',
				      success: function (infoRes) {
						  console.log('用户昵称为：' + infoRes);
				        console.log('用户昵称为：' + infoRes.userInfo.openId);
				      },
					  fail: (res) => {
					  	console.log(2222222,res)
					  }
				    });
				  }
				});
				member(this.$store.state.app.uid,this.isFlag).then(res => {
					this.us=res.data.vipDay
					if(res.data.isNewUser==0){
						if(res.data.vipDay==0){
							uni.showModal({
								title:"提示",
								content:"您的会员已到期，请点击确定按钮，前往充值会员",
								success:function(res) {
									if(res.confirm){
										console.log("确定")
										uni.navigateTo({
											url:"/pages/users/user_vip/index"
										})
									}else if(res.cancel){
										console.log("取消")
									}
								}
							})
						}
						if(res.data.vipDay>=1){
							console.log("跳转")
							const craneid = this.carModel[this.modelIndex].id;
							
							uni.navigateTo({
								url: `/pages/carDetails/index?craneid=${craneid}`,
								complete: (e) => {
									console.log('-----', e);
								}
							})
						}
						
						// if(this.us==1){
						// 	var that=this
						// 	uni.showModal({
						// 		title:"提示",
						// 		content:"您是当前系统新用户，免费享受3天VIP会员特权",
						// 		success:function(res) {
						// 			if(res.confirm){
						// 				const craneid = that.carModel[that.modelIndex].id;
						// 				uni.navigateTo({
						// 					url: `/pages/carDetails/index?craneid=${craneid}`,
						// 					complete: (e) => {
						// 						console.log('-----', e);
						// 					}
						// 				})
						// 			}else if(res.cancel){
						// 				console.log("取消")
						// 			}
						// 		}
						// 	})
						// }
					}
					if(res.data.isNewUser==1){
						var that=this
						uni.showModal({
							title:"提示",
							content:"您是当前系统新用户，免费享受3天VIP会员特权",
							success:function(res) {
								if(res.confirm){
									
									member(that.$store.state.app.uid,that.getadd).then(res=>{
										
									})
									const craneid = that.carModel[that.modelIndex].id;
									
									uni.navigateTo({
										url: `/pages/carDetails/index?craneid=${craneid}`,
										complete: (e) => {
											console.log('-----', e);
										}
									})
								}else{
									uni.navigateBack(1)
								}
							}
						})
					}
				})
			
			 
				console.log("会员",this.us)
				
				
				
				
				
			},
			getBrandList: function() {
				
				const _this = this;
				return getBrandList().then(res => {
					console.log("品牌",res)
					if (res.data) {
						
						_this.brandList = res.data;
						_this.carBrand = res.data;
						
					}
				})
			},
			getCarList: function(id) {
				const _this = this;
				getCraneList({
					cbrandid: id
				}).then(res => {
					console.log("测试123",res)
					_this.modelIndex = null;
					_this.carModel = res.data.craneList;
				})
			}
		}
	}
</script>
<style lang="scss">
	.index {
		display: flex;
		flex-direction: column;
		justify-content: center;
		align-items: center;
		padding: 80upx 0;
		background: #FFFFFF;

		.itemBox {
			height: 66upx;
			width: 480upx;
			line-height: 66upx;
			font-size: 30upx;
			color: #CCCCCC;
			border-bottom: 1upx solid #CCCCCC;
			position: relative;

			&+.itemBox {
				margin-top: 78upx;
			}

			&.active {
				color: #212121;
			}

			&::after {
				position: absolute;
				width: 40upx;
				height: 40upx;
				right: 0;
				top: 50%;
				margin-top: -20upx;
				background: url(./images/downArrow.png) 0 0 /100% 100%;
				content: '';
			}
		}

		.button {
			width: 480upx;
			height: 85upx;
			margin-top: 80upx;
			line-height: 85upx;
			font-size: 30upx;
			text-align: center;
			color: #FFFFFF;
			border-radius: 8upx;
			background-color: #0081FF;
		}
	}
</style>
